<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib prefix="c"  uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" href="layui/css/layui.css" media="all" />
<link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" media="all" />
<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" media="all" />
<meta charset="UTF-8">
<title>${ blogs.user_id.user_username }的博客</title>
</head>
<body  style="text-align: center;align-content: center;background-image: url('images/admin/login_bg.jpg')">
<div style="display: none;" id="blogs_id">${ blogs.blogs_id }</div>
<div style="display: none;" id="user_id">${ user.user_id}</div>
	<div  style="width: 800px;height:atuo;border: 0px solid black;margin-bottom: 100px;margin-left:350px">
		<h1>${ blogs.blogs_title }</h1>
		${ blogs.blogs_content }
	</div>
	
	
	<div id="mypl">
		<div style="width:550px; height: auto;margin:auto;border: 1px solid gray;">
		<table id="mypl1"  width="550px" border="0px" style="text-align: left;text-indent: 10px;">
			<c:forEach var="reply" items="${ reply }">
			<tr style="border-bottom: 1px solid gray;">
				<td width="100px" style="text-align: right;">
					<a style="text-decoration: underline;color: blue;" href="javascript:void(0)" onclick="openw(${reply.user_id.user_id})">${ reply.user_id.user_username }</a>说:
				</td>
				<td>${ reply.blogs_comment }</td>
				<td width="150px" >
				<a style="color:navy;" href="javascript:void(0)" onclick="hf(${reply.br_id})">回复</a>&nbsp;&nbsp;&nbsp;&nbsp;
				<c:if test="${ user.user_id==reply.user_id.user_id}"><a  href="javascript:void(0)" onclick="del(${reply.br_id})">删除</a></c:if>
				&nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:void(0)" onclick="zk(${reply.br_id})">展开</a>
				</td>
			</tr>
		</c:forEach>
		</table>
		<tr>
			<td><a href="javascript:void(0)" onclick="up(${ blogs.blogs_id },'up')">上一页</a></td>
			<td></td>
			<td><a href="javascript:void(0)" onclick="up(${ blogs.blogs_id },'next')">下一页</a></td>
		</tr>
		</div>
		<br/>
		<br/>
		<a style="cursor:pointer;">收藏</a>&nbsp;&nbsp;&nbsp;&nbsp;
		<a style="cursor:pointer;" id="dz"><c:if test="${ dz }">取消</c:if>点赞</a>&nbsp;&nbsp;&nbsp;&nbsp;
		<a style="cursor:pointer;" id="pr">评论</a>
		<br>
		<div class="prt" style="margin: auto;width: 700px;display: none;">
			<textarea id="plk" style="display: none;"></textarea>
			<button id="fb">发表</button>
		</div>
		<div id="hfr" style="margin: auto;width: 700px;display: none;">
			<textarea id="hfk" style="display: none;"></textarea>
			<button id="hfpl">回复</button>
		</div>
		<br>
		<jsp:include  page="bottom.jsp" flush="true"/>
	</div>
	<div id='box'></div>
</body>
<script type="text/javascript" src="layui/layui.all.js"></script>
<script type="text/javascript" src="layui/layui.js"></script>
<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" >
function openw(data){
	window.open('tablogs?userid='+data,data,'',true);
	
}
$(function(){
	$('#box').dialog({    
	    title: '评论区',    
	    width: 700,    
	    height: 400,    
	    closed: true,    
	    cache: false,    
	    modal: true   ,
	});
})
	function del1(r_id,br_id){
		//alert(r_id);
		layer.confirm('您确定要删除评论吗？', {
			btn: ['确定','取消'] //按钮
		}, 
		function(){
			layer.closeAll('dialog');
			$.ajax({
				url:'del2',
				type:'post',
				data:{
					_method:"DELETE",
					r_id:r_id,
				},
				success:function(data){
					lod(br_id);
				}
			});
		})
	}
	function xtj(){
		$("#hfpl1").hide();
		$.ajax({
			url:'reply1',
			type:'post',
			data:{
				blogs:$("input[name='context']").val(),
				rid:$("#br_id").val(),
				br_id:$("#r_user").val(),
			},
			success:function(dd){
				//alert(dd);
				lod($("#br_id").val());
			}
		});
	
	}
	function lod(data){
		$.ajax({
			url:'unfold',
			type:'post',
			data:{
				id:data,
			},
			success:function(dd){
				$("#box").html(dd.data);
				$('#box').dialog('open');
			}
		});
	}
	function hf1(br_id,r_user){
		//alert(br_id+":"+r_user);
		$("#br_id").val(br_id);
		$("#r_user").val(r_user);
		//alert($("#br_id").val());
		$("#hfpl1").toggle();
	}
	function zk (data){
		//alert(data);
		lod(data);
	}
	
	function del(data){
		layer.confirm('您确定要删除评论吗？', {
			btn: ['确定','取消'] //按钮
		}, 
		function(){
			layer.closeAll('dialog');
			$.ajax({
				type: "post",
				url: "delreply",
				data: {
					_method:"DELETE",
					id: data
				},
				success : function(data){
					//alert(data);
				}
			});
		})
	}

	function up(data,event){
		//alert(data);
		//alert(event);
		$.ajax({
			url:'replypage',
			type:'post',
			data:{
				blogs_id:data,
				state:event
			},
			success:function(data){
				//alert(data);
				
					var reply=data.reply;
					console.log(reply);
					$("#mypl1").html(data.str);
					//alert(data.str);
					
				
			}
		})
		
	}
	var vhf=true;
	var vfb=true;
	function hf (data){
		
		if(vfb){
			var a=$("#hfr").toggle();
			$("#hfpl").attr('rid',data);
		}
		var f=$("#hfr").css('display');
		if(f=='none'){
			vhf=true;
		}else{
			vhf=false;
		}
	}
	$(function(){
		var img=$("img");
		for(var i=0;i<img.size();i++){
			var falg=img.eq(i).attr('alt');
			if(!falg){
				img.eq(i).css("width","800");
				img.eq(i).css("height","400");
			}
		}
		$("#dz").click(function(){
			$.ajax({
				url:"dz",
				type:"post",
				data:{
					id:$("#blogs_id").text(),
				},
				success:function(data){
					if(data=="true"){
						$("#dz").html("取消点赞");
					}else{
						$("#dz").html("点赞");
					}
				}
			})
		})
		$("#pr").click(function(){
			if(vhf){
				$(".prt").toggle();
			}
			var f=$(".prt").css('display');
			if(f=='none'){
				vfb=true;
			}else{
				vfb=false;
			}
		});
		
		var index;
		layui.use('layedit', function(){
			  var layedit = layui.layedit;
			  index=layedit.build('plk', {
				  tool: [ 
					  ,'link' //超链接
					  ,'unlink' //清除链接
					  ,'face' //表情
					  ],
					  height:100,
					  width:700
				});     
				/* alert(index); */
				$("#fb").click(function(){
					$.ajax({
						url:"reply",
						type:"post",
						data:{
							id:$("#blogs_id").text(),
							blogs:layedit.getContent(index),
						},
						success:function(data){
							//alter(data);
							$(".prt").hide();
							$("#plk").val('');
							window.location.reload();
						}
					})
				});
			});
		var ind;
		layui.use('layedit', function(){
			  var layedit = layui.layedit;
			  ind=layedit.build('hfk', {
				  tool: [ 
					  ,'link' //超链接
					  ,'unlink' //清除链接
					  ,'face' //表情
					  ],
					  height:100,
					  width:700
				});     
				
				/* --------------------------  */
				$("#hfpl").click(function(){
					//alert($(this).attr('rid'))
					$.ajax({
						url:"reply1",
						type:"post",
						data:{
							blogs:layedit.getContent(ind),
							rid:$("#hfpl").attr("rid")
						},
						success:function(data){
							//alert(data);
							$("#hfr").hide();
							$("#hfk").val('');
							window.location.reload();
						}
					})
				});
			});
	})
</script>
</html>